import { Space, Tooltip } from 'antd';
import { QuestionCircleOutlined } from '@ant-design/icons';
import React from 'react';
import { useModel, history } from 'umi';
import Avatar from './AvatarDropdown';
import styles from './index.less';
import { LogoutOutlined } from '@ant-design/icons';

const RightContent = ({ location }) => {
  const loginOut = async () => {
    history.replace({
      pathname: '/user/login',
    });
  };
  const { initialState, setInitialState } = useModel('@@initialState');

  let className = styles.right;

  return (
    <Space className={className}>
      <Avatar />
      <Tooltip placement="bottomRight" title="退出登录">
        <LogoutOutlined
          style={{ color: '#fff', marginRight: 24 }}
          onClick={() => {
            setInitialState((s) => ({ ...s, currentUser: undefined }));
            loginOut();
          }}
        />
      </Tooltip>
    </Space>
  );
};

export default RightContent;
